<template>
  <el-dialog :visible.sync="visible" :close-on-click-modal="false" :title="$t('添加退货单')" custom-class="dialog_big">

    <ex_super_table_page ref="TablePage" :autoLoad="false" :autoPage="true" :autoFlex="false"
      :urlDataHandle="urlDataHandle" :search="search" :table="table" :urlParams="urlParams"
      @selection-change="e => selection = e">
    </ex_super_table_page>
    
    <span slot="footer" class="dialog_footer">
      <el-button @click="visible = false">{{ $t('label_cancel') }}</el-button>
      <el-button type="primary" @click="submitReady">{{ $t('label_submit') }}</el-button>
    </span>

  </el-dialog>
</template>

<script>
import role_system_mixin from "@/mixin/role_system_mixin";

export default {
  mixins: [role_system_mixin],
  components: {},
  data() {
    return {

      visible: false,

      form: {
        bizType: "TOB",
        warehouseId: null,
        warehouseName: null,
        warehouseCode: null,
      },
      selection: [],
      search: {
        default: {},
        model: [
          {
            key: 'warehouseName', label: 'label_current_search_warehouse', itemClass: "w_fill bold", formType: "text",
            formatter: (r, c, v) => this.$formatNameCode(this.form.warehouseName, this.form.warehouseCode),
          },
          {
            label: "label_time_type", key: 'queryTimeType', type: 'select', enum: 'ReturnTimeQueryTypeEnum', fold: false,
            on: {
              change: (e) => {
                if (!e) {
                  this.$set(this.$refs.TablePage.$refs.search.getData(), "timeFrom", null)
                  this.$set(this.$refs.TablePage.$refs.search.getData(), "timeTo", null)
                }
              }
            },
          },
          {
            key: 'timeFrom', label: "label_time_range", fold: false, type: 'date-picker', attrs: { type: 'datetime' },
            render: (h, { data, item }) => {
              const value = data[item.key]
              const limitKey = 'timeTo'
              const limitValue = data[limitKey]
              const disabledKey = 'queryTimeType'
              const disabledValue = !data[disabledKey]
              return (<ex_super_input value={value} disabled={disabledValue} onInput={e => this.$set(data, item.key, e)} type="date-picker" placeholder="label_start_time"
                attrs={{ type: 'datetime' }}
                pickerOptions={{
                  disabledDate: date => { return limitValue ? (limitValue < date.getTime()) : false }
                }}
              />)
            }

          },
          {
            key: 'timeTo', label: "~", fold: false, type: 'date-picker', attrs: { type: 'datetime' },
            render: (h, { data, item }) => {
              const value = data[item.key]
              const limitKey = 'timeFrom'
              const limitValue = data[limitKey]
              const disabledKey = 'queryTimeType'
              const disabledValue = !data[disabledKey]

              return (<ex_super_input value={value} disabled={disabledValue} onInput={e => this.$set(data, item.key, e)} type="date-picker" placeholder="label_end_time"
                attrs={{ type: 'datetime', 'default-time': '23:59:59' }}
                pickerOptions={{
                  disabledDate: date => { return limitValue ? (limitValue > date.getTime()) : false }
                }}
              />)
            }
          },
          {
            label: "label_return_type", key: "returnType", type: "select", enum: 'ReturnRetTypeEnum',
            listHandler: l => l.filter(it => ['PLATFORM', 'WAREHOUSE'].includes(it)),
          },
          { label: "label_platform", key: "platformCode", type: "select", enum: 'SrmOrderTypeEnum', if: (data) => data.returnType != "WAREHOUSE" },
          { label: 'label_platform_store', key: 'shopId', if: (data) => data.returnType != "WAREHOUSE" },

        ],
      },
      table: {
        url: '/oms-api/refund/ReturnOrderRpc/selectList.json',
        height: "500",
        model: [
          { type: 'selection', clickToggle: true, },
          {
            key: 'code', label: 'label_return_order_code', "min-width": 150,
          },
          {
            key: 'trackingNumber', label: 'label_track_code', "min-width": 150,
          },
          { key: 'returnType', label: 'label_return_type', "width": 130, formatter: (r, c, v, i) => this.$enumShow(v, "ReturnRetTypeEnum") },

          { key: 'platformName', label: 'label_platform', 'show-overflow-tooltip': true, "width": 130, },
          { key: 'shopId', label: 'label_platform_store', 'show-overflow-tooltip': true, "width": 130, },
          {
            key: 'customerTrackingNumber', label: 'label_customer_track_code', 'show-overflow-tooltip': true, "width": 130,
          },
        ],
      },

    }
  },
  props: {


  },

  computed: {
    TOB() {
      return this.form.bizType == 'TOB'
    },

  },
  methods: {
    urlDataHandle(res) {
      if (!res.data || _.isEmpty(res.data.rows)) {
        this.$message.error(this.$t("仓库中未找到退货单"))
        return []
      }
      return res.data.rows
    },
    urlParams(params) {
      return Object.assign({ isUnclaimed: "Y", status: "COMPLETE", hasOwnerLessDestroy: "N" }, params, _.pick(this.form, ['warehouseId', 'bizType',]))
    },
    // changeSku(e) {
    //   this.$refs.MainTable.loadData(this.urlParams({}));
    // },
    // reloadTable(e) {
    //   this.$refs.MainTable.loadData(this.urlParams({}));
    // },
    show(item) {
      this.visible = true
      if (this.$refs.TablePage) this.$refs.TablePage.clearSelection();
      const eqKeys = ['warehouseId', 'bizType',]
      if (eqKeys.some(k => this.form[k] != item[k])) {
        this.form = _.clone(item)
        this.$nextTick(() => {
          this.$refs.TablePage.resetSearch();
          // console.log("show")
          this.$refs.TablePage.loadDataForSearch();
        })
      }

    },
    hide() {
      this.visible = false
    },
    submitReady() {

      this.submit()
    },

    submit() {
      let select = this.selection;
      if (select.length == 0) {
        return this.$message.error(this.$t("tip_please_tick"))
      }
      this.$ajax({
        url: "/oms-api/refund/ReturnOrderRpc/selectDetailByIds.json",
        method: 'post', loading: true,
        data: {
          ids: select.map(it => it.id),
        },
        success: (res) => {

          if (res.data && res.data.rows) {
            this.$emit('submitSuccess', res.data.rows)
            this.visible = false
          }
        }
      })

    },
  }
}
</script>
